<template>
	<div class="projectContainer">
		<projectDetail v-model:currentData="currentData" @handleClick="handleClick" />
		<a-modal :maskClosable="false" width="800px" v-model:open="modal.visible" :ok-button-props="{ disabled: modal.formDisable }" :footer="null">
			<addAndEditProject v-model="formModel" @handleSubmit="handleSubmit" @handleCancel="modal.visible = false" :disabled="modal.formDisable" />
		</a-modal>

		<a-modal :maskClosable="false" width="800px" v-model:open="projectResultModal.visible"  @ok="handleProjectResultSubmit">
      <div style="padding-top: 30px;">
				<div style="display: flex;align-items: center;margin-top: 10px;;">
					<div style="min-width: 220px;" class="">{{t('projectDetail', '项目成果展示')}}</div>
					<div>
						<minMultipleUploadImage :disabled="projectResultDisabled" :limit="6" :multiple="true" v-model="projectResultFormModel.projectResultFileList" v-model:previewImage="projectResultFormModel.previewImage" :customUploadImage="customUploadImage" />
					</div>
				</div>
				<div style="display: flex;align-items: center;margin-top: 10px;">
					<div style="min-width: 220px;" class="">{{t('projectDetail', '项目成果链接')}}</div>
					<a-input v-model:value="projectResultFormModel.resultLink" :placeholder="t('common', '请输入')"></a-input>
				</div>
			</div>

		</a-modal>
	</div>
</template>
<script setup>
import projectDetail from '@/components/process/projectDetail.vue';
import addAndEditProject from '@/components/teacher/addAndEditProject.vue';
import { ref, reactive, inject,onMounted } from 'vue';
import { teacherProjectFindById, teacherProjectModify } from '@/request/teacher/project/development';
import {
	projectResultGet,
	projectResultUpload,
	projectResultSave
}from '@/request/process/project.js'
import { message } from 'ant-design-vue'
import MarkdownIt from 'markdown-it'
import minMultipleUploadImage from '@/components/common/minMultipleUploadImage.vue'
import { t } from '@/i18n'
const loading = ref(false)
const modal = reactive({ visible: false, formDisable: false, name: '' })
const projectResultModal = reactive({ visible: false, formDisable: false, name: '' })
const projectResultFormModel = ref({})
const projectResultDisabled = ref(false)
const projectResultLoading = ref(false)
const formModel = ref({ projectJobDTOList: [{}] })
let pojectInfo = JSON.parse(sessionStorage.getItem('pojectInfo') || '{}')
const currentData = ref({})
const currentItem = ref({})
function markdownIt(){
		const md = new MarkdownIt();
		if(currentData.value.describe&&currentData.value.describe.includes('###')){
			currentData.value.describe=md.render(currentData.value.describe);
		}
		if(currentData.value.scoreStandard&&currentData.value.scoreStandard.includes('###')){
			currentData.value.scoreStandard=md.render(currentData.value.scoreStandard);
		}
		if(currentData.value.target&&currentData.value.target.includes('###')){
			currentData.value.target=md.render(currentData.value.target);
		}
	}

// onMounted(()=>{
// 	show()
// 	markdownIt()
// 	console.log('currentData.value',currentData.value)
// })
const customUploadImage = async (info) => {
	let res = await projectResultUpload({
		file: info.file,
	}, currentItem.value.id)
	if (res) return res.data
}
const show = async () => {
	let req = {
		...pojectInfo
	}
	// 项目详情
	let res = await teacherProjectFindById(req)
	if (!res) return
	currentData.value = {
		...res.data,
		newProjectResultFileList: res?.data?.projectResultFileList?.reduce((acc, curr, index) => {
			if (index % 2 === 0) {
				// 每两个元素创建一个新数组
				acc.push([curr, res?.data?.projectResultFileList[index + 1]]);
			}
			return acc;
		}, [])
	}
	markdownIt()
}
show()
const handleClick = async ({name, item}) => {
	currentItem.value = item
	console.log(name, item)
	let req = {...item}
	let res = null
	let operate = null
	switch (name) {
		case '编辑':
			formModel.value = {
				...item,
				course: item?.courseList?.map(val => val.course),
				gradeClass: item?.gradeClassList?.map(val => val.gradeClass),
				projectJobDTOList: item.projectJobList || [{}],
				coTeacherIds: item?.coTeacherList?.map(val => val.teacherId) || [],
				mainTeacherId: item?.mainTeacher?.teacherId
			}
			modal.visible = true
			modal.formDisable = false
			modal.name = t('common','编辑')
			break
		case '维护项目成果':
			res = await projectResultGet(item.id)
			if (!res) return
			projectResultFormModel.value = {
				...res.data,
				previewImage:  res.data.projectResultFileList.map(val => val.fileUrl),
			}
			projectResultModal.visible = true
			break
	}
}
const handleSubmit = async (val) => {
	let req = {
		...val,
		course: val?.course?.join(),
    gradeClass: val?.gradeClass?.join(),
	}
	loading.value = true
	let res = await teacherProjectModify(req)
	loading.value = false
	if (!res) return
	modal.visible = false
	message.success(t('common',"保存成功"))
	show()
}

const handleProjectResultSubmit = async (val) => {
	console.log(projectResultFormModel.value)
	projectResultLoading.value = true
	let res = await projectResultSave({
		...projectResultFormModel.value,
		projectResultFileList: projectResultFormModel.value.projectResultFileList.filter(v => v),

	}, currentItem.value.id)
	projectResultLoading.value = false
	if (!res) return
	projectResultModal.visible = false
	message.success(t('common',"保存成功"))
	show()
}
</script>

<style lang="scss" scoped>
.projectContainer {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	overflow: auto;
}
</style>